<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"/>
    <title>后台管理系统模板</title>
    <link rel="icon" href="favicon.ico" type="image/ico">
    <meta name="keywords" content="">
    <meta name="description" content="一个基于Bootstrap v3.3.7的后台管理系统的HTML模板。">
    <meta name="author" content="yinqi">
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/materialdesignicons.min.css" rel="stylesheet">
    <link href="css/style.min.css" rel="stylesheet">
    <style>
        .my-pagination {
            display: inline-block;
            padding-left: 0;
            margin: 20px 0;
            border-radius: 4px;
        }

        .my-pagination > li {
            display: inline;
        }
    </style>
</head>

<body>
<div class="lyear-layout-web">
    <div class="lyear-layout-container">
        <!--左侧导航-->
        <div th:insert="~{commons/commons::sidebar(active='employees.html')}"></div>
        <!--End 左侧导航-->

        <!--头部信息-->
        <div th:insert="~{commons/commons::topbar(title='员工列表')}"></div>
        <!--End 头部信息-->

        <!--页面主要内容-->
        <main class="lyear-layout-content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="card">
                            <div class="card-toolbar clearfix">
                                <form class="form-inline" style="margin: 20px 0px;" th:action="@{employees}" method="get">
                                    <div class="form-group">
                                        <input type="hidden" name="pageIndex" th:value="${currentPage}">
                                        <input type="hidden" name="pageSize" th:value="${pageSize}">
                                        <label  for="name">员工名</label>
                                        <input class="form-control" type="tetx " id="name" name="name" placeholder="请输入员工名">
                                    </div>
                                    <div class="form-group">
                                        <button class="btn btn-primary" type="submit">查 询</button>
                                    </div>
                                </form>
                                <div style="text-align: right" class="toolbar-btn-action">
                                    <a class="btn btn-primary m-r-5" th:href="@{/addEmployee}"><i class="mdi mdi-plus"></i> 新增</a>
                                    <!--                  <a class="btn btn-success m-r-5" href="#!"><i class="mdi mdi-check"></i> 启用</a>-->
                                    <!--                  <a class="btn btn-warning m-r-5" href="#!"><i class="mdi mdi-block-helper"></i> 禁用</a>-->
<!--                                    <a class="btn btn-danger" onclick=""><i class="mdi mdi-window-close"></i> 删除</a>-->
                                </div>
                            </div>
                            <div class="card-body">

                                <div class="table-responsive">
                                    <table class="table table-bordered">
                                        <thead>
                                        <tr>
<!--                                            <th>-->
<!--                                                <label class="lyear-checkbox checkbox-primary">-->
<!--                                                    <input type="checkbox" id="check-all" ><span></span>-->
<!--                                                </label>-->
<!--                                            </th>-->
                                            <th>ID</th>
                                            <th>员工名</th>
                                            <th>角色</th>
                                            <th>性别</th>
                                            <th>出生日期</th>
                                            <th>修改时间</th>
                                            <th>创建时间</th>
                                            <th>操作</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <tr th:each="employee : ${employeeList}">
<!--                                            <td>-->
<!--                                                <label class="lyear-checkbox checkbox-primary">-->
<!--                                                    <input type="checkbox" name="ids[]"-->
<!--                                                           th:value="${employee.getId()}"><span></span>-->
<!--                                                </label>-->
<!--                                            </td>-->
                                            <td th:text="${employee.getId()}"></td>
                                            <td th:text="${employee.getName()}"></td>
                                            <td th:text="${employee.getRole()}"></td>
                                            <td th:text="${employee.getSex()== '1' ? '男': '女'}"></td>
                                            <td th:text="${employee.getBirthday()}"></td>
                                            <td th:text="${#dates.format(employee.getUpdateTime(), 'yyyy-MM-dd HH:mm')}"></td>
                                            <td th:text="${#dates.format(employee.getCreateTime(), 'yyyy-MM-dd HH:mm')}"></td>
                                            <td>
                                                <div class="btn-group">
                                                    <a class="btn btn-xs btn-default" th:href="@{editEmployee(id=${employee.getId()})}" title="编辑"
                                                       data-toggle="tooltip"><i class="mdi mdi-pencil"></i></a>
                                                    <a class="btn btn-xs btn-default"  onClick="return confirm('确定删除?');" th:href="@{deleteEmployeeById(id=${employee.getId()})}" title="删除"
                                                       data-toggle="tooltip"><i class="mdi mdi-window-close"></i></a>
                                                </div>
                                            </td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <nav>
                                    <ul class="pagination pagination-lg">
                                        <li>
                                            <a th:if="${currentPage >1}"
                                               th:href="@{${'/employees'}(pageIndex=${currentPage -1},pageSize=${pageSize})}"
                                               aria-label="Previous">
                                                <span aria-hidden="true">&laquo;</span>
                                            </a>
                                            <a th:if="${currentPage ==1}" href="javascript:void(0);"
                                               aria-label="Previous">
                                                <span aria-hidden="true">&laquo;</span>
                                            </a>
                                        </li>

                                        <li th:class="${currentPage ==pageNo ? 'active':''}"
                                            th:each="pageNo : ${#numbers.sequence(1, pages)}">
                                            <a th:if="${currentPage eq pageNo}" href="javascript:void(0);">
                                                <span th:text="${pageNo}"></span>
                                            </a>

                                            <a th:if="${not (currentPage eq pageNo)}"
                                               th:href="@{${'/employees'}(pageIndex=${pageNo},pageSize=${pageSize})}">
                                                <span th:text="${pageNo}"></span>
                                            </a>
                                        </li>

                                        <li>
                                            <a th:if="${currentPage < pages}"
                                               th:href="@{${'/employees'}(pageIndex=${currentPage+1},pageSize=${pageSize})}"
                                               aria-label="Next">
                                                <span aria-hidden="true">&raquo;</span>
                                            </a>
                                            <a th:if="${currentPage == pages}" href="javascript:void(0);"
                                               aria-label="Next">
                                                <span aria-hidden="true">&raquo;</span>
                                            </a>
                                        </li>
                                    </ul>
                                </nav>

                            </div>
                        </div>
                    </div>

                </div>

            </div>

        </main>
        <!--End 页面主要内容-->
    </div>
</div>

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/perfect-scrollbar.min.js"></script>
<script type="text/javascript" src="js/main.min.js"></script>

<script>

    $(function () {

    })
</script>
</body>
